<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/header::common_header(~{::title},~{::link},~{})">
    <title>实时数据</title>
    <link rel="stylesheet" href="/css/index.css" type="text/css">
</head>
<body>
<div th:replace="common/bar::topbar" style="height: 100%"></div>
<div class="container-fluid">
    <div class="row">
        <!--左边导航栏-->
        <div th:replace="common/bar::#sidebar"></div>
        <!--//中间表格栏-->
        <div>
            <table class="table table-hover" style="margin: 30px">
                <thead class="thead-light">
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">设备</th>
                    <th scope="col">更新时间</th>
                    <th scope="col">数值</th>
                    <th scope="col">单位</th>
                </tr>
                </thead>
                <tbody id="t_body">
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
</html>

<script type="text/javascript">
    $(document).ready(function () {
        window.onload = initCard();

        function initCard() {
            $.ajax({
                url: '/data/api/realData',
                type: 'get',
                dataType: 'json',
                data: {},
                success: function fillTable(JSONdata) {
                    var data = JSONdata.data
                    var trs = ''
                    if (JSONdata.code == 200)
                        for (var i = 0; i < data.length; i++) {

                            if(data[i].devId!=22){

                                var tr = '<tr >' +
                                    '<th scope="row"> </th>' +
                                    '<td >' +
                                    '<span><a style="float: left"  href="/device/' + data[i].devId + '">' + data[i].nodeName + '</a></span>' +
                                    '<span style="float: right;color: darkgrey;"> ' + data[i].deviceDesc + '</span>' +
                                    '</td>\n' +
                                    '<td id="time'+data[i].devId+'">' + data[i].acceptTime + '</td>' +
                                    '<td id="value'+data[i].devId+'">' + data[i].value + '</td>' +
                                    '<td >' + data[i].unit + '</td>' +
                                    '</tr>';
                                trs += tr;

                            }

                        }
                    $("#t_body").append(trs);

                }

            })

        }
    })

</script>


